<template>
	<view style="padding: 40rpx;">
		<view class="logo">
			<image src="../../static/diancan.png"  mode=""></image>
		</view>
		<view
			style="padding: 20rpx; margin: 80rpx 0; background-color: #fff; box-shadow: 0 2rpx 10rpx rgba(0,0,0,.1); border-radius: 10rpx;">
		
			<input class="bg-light  px-3  mb-4" v-model="form.username"  placeholder="请输入账号" />
			<input v-model="form.password" type="password" class="bg-light  px-3 mb-4" placeholder="请输入密码" />
						<input v-model="repassword" type="password" class="bg-light  px-3 mb-4" placeholder="请输入确认密码" />
			<button @click="login()"
				style="background-color: #ffd100; border-color: #ffd100; height: 70rpx; line-height: 70rpx;">注册</button>
			</uni-forms>
			<p class="tip">前往 <span @click="rigister">登录</span></p>
		</view>
	</view>
</template>
<style>
	.logo image{
		width: 40px;
		height: 40px;
	}	
	.logo{
		text-align: center;
	}
	.tip{
		font-size: 14px;
		text-align: right;
	}
	.tip span{
		color: dodgerblue;
	}
</style>
<script>
	import $H from '../../utils/request.js';
	export default {
		data() {
			return {
				repassword:"",
				form: {
					role: 'USER'
				}
			}
		},
		methods: {
			rigister(){
				uni.navigateTo({
					url:"/pages/index/index"
				})
			},
			login() {
				if(this.repassword !== this.form.password){
					uni.showToast({
						icon:"none",
						title:"两次密码输入不一致"
					})
					return
				}
				if(this.repassword == ''|| !this.form.password ||!this.form.username){
					uni.showToast({
						icon:"none",
						title:"请输入用户名和密码"
					})
					return
				}
				$H.post('user/registry', this.form).then(res => {
					if (res) {
						uni.showToast({
							icon: 'success',
							title: '注册成功'
						})
					
						
					
						// 跳转主页
						uni.navigateTo({
							url: '/pages/index/index'
						})
					} else {
						uni.showToast({
							icon: 'error',
							title: res.msg
						})
					}
				
				})
			}
		}
	}
</script>
